import React from 'react';
import {View, Text, FlatList, StyleSheet} from 'react-native';
import QuestionCell from "../../components/question/Cell";
import {getQuestion} from "../../service/question";

class Question extends React.PureComponent {
    static navigatorStyle = {
        navBarCustomView:'interview.question.listTopNav'
    }
    constructor(props) {
        super(props);

        this.state = {
            data: [
                {question: '测试标题', id: 1}
            ]
        }
    }

    componentDidMount() {
        this.getData();
    }

    render() {
        return (
            <FlatList style={styles.container}
                      data={this.state.data}
                      keyExtractor={this.keyExtractor}
                      ItemSeparatorComponent={this.itemSeparatorComponent}
                      renderItem={this.renderItem}/>
        )
    }

    itemSeparatorComponent = (sectionID, rowID, adjacentRowHighlighted)=>{
        return <View style={styles.rowSeparator}/>
    }

    renderItem = ({item, index}) => {
        // console.log('问题',item);
        return <QuestionCell key={index} question={item} show={this.showDetail}/>
    }

    keyExtractor = (item,index) => item.id

    showDetail = (question) => {
        this.props.navigator.push({
            screen: 'interview.question.detail',
            passProps:question
        })
    }

    async getData() {
        // getQuestion();
        try {
            const result = await getQuestion();
            // console.log(result)
            this.setState({
                data:result.map(item=>({
                    ...item.toJSON(),
                    id:item.id
                }))
            })
        } catch (e) {
            console.error(e)
        }
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor:'red'
    },
    rowSeparator:{
        height:10,
        backgroundColor:'blue'
    }
});


export default Question